<script setup lang="ts">
import filterComponent from '@/components/filterComponentPro/index.vue'
import tableComponent from '@/components/tableComponent/index.vue'
import crumbs from '@/components/crumbs.vue'
import {queryAdvertiseList} from '@/api/querySmsTradeRecord/querySmsTradeRecord';
import {onMounted, ref} from "vue";
import type {queryAdvertiseListItemDto, queryAdvertiseListDataDto} from "@/api/querySmsTradeRecord/type";

const filterData = ref({
    list: {
        keyWord: {
            name: '关键字',
            prop: 'keyWord',
            value: '',
            placeholder: '请输入关键字',
            type: 'input',
        }
    },
    buttonList: []
})
const tableData = ref<queryAdvertiseListItemDto[]>([])
const tableHeader = ref([
    {
        label: '收款银行名称',
        prop: 'payeeBank',
        width: 200,
    },
    {
        label: '收款户名',
        prop: 'payeeName',
        width: 200,
    },
    {
        label: '到账时间',
        prop: 'tradeDateTime',
        width: 150,
    },
    {
        label: '收款金额',
        prop: 'amount',
        width: 150,
    },
    {
        label: '付款户名',
        prop: 'payerName',
        width: 200,
    },
    {
        label: '创建时间',
        prop: 'createTime',
        width: 150,
    },
    {
        label: '原始短信',
        prop: 'oldData',
    },
])
const pageInfo = ref({
    pageNum: 1,
    pageSize: 10,
    total: 0
})
const getData = async () => {
    let res = await queryAdvertiseList({
        searchText: filterData.value.list.keyWord.value,
        pageNum: pageInfo.value.pageNum,
        pageSize: pageInfo.value.pageSize,
    })
    tableData.value = res.list
    pageInfo.value.total = res.totalCount
}
const handleSearch = () => {
    getData()
}
const handlePageChange = () => {
    getData()
}
const back = () => {
    window.history.back()
}
onMounted(() => {
    getData()
})
</script>

<template>
    <div>
        <!-- 面包屑导航 -->
        <div class="page_top">
            <div class="left_btn" @click="back">
                <img src="../../assets/image/back.png" alt=""/>
            </div>
            <crumbs basetitle="财务" title="银行收款短信"></crumbs>
        </div>
        <div class="w-full box-border p-16px">
            <el-card class="mb-16px">
                <filterComponent noEmit v-model:filter-data="filterData" :showClear="false" @doSearch="handleSearch"/>
            </el-card>
            <el-card class="mb-16px">
                <tableComponent class="set-height" :table-header="tableHeader" :needDetail="true"
                                :table-data="tableData"
                                v-model:page-info="pageInfo" @pageChange="handlePageChange">
                </tableComponent>
            </el-card>
        </div>
    </div>
</template>

<style scoped lang="scss">

</style>